<%--
  Created by IntelliJ IDEA.
  User: MySunshine
  Date: 2022/10/26
  Time: 11:07
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>书籍类型管理</title>
    <link rel="stylesheet" href="../../layui/css/layui.css">
    <style>
        body{
            background-color:  #243b55;
        }
        h1{
        color: #e4a74c;
            text-align: center;
            padding: 40px;
        }

    </style>
</head>
<body>

<div class="layui-row layui-col-md6 layui-col-md-offset3 " >
    <h1>书籍类型管理</h1>
<table class="layui-table" id="data" lay-filter="tableFil" ></table>

</div>

</body>
<script src="../../layui/layui.js"></script>
<script>
    layui.use(['table','jquery','layer'],function () {
        let layer = layui.layer;
        let table = layui.table;
        let $ = layui.jquery;
        table.render({
            elem: "#data",
            url: "/KindSelectAllByDba",
            cols: [[
                {type: "numbers", title: "序号", width: "10%"},
                {field: "kid", title: "书籍类型编号"},
                {field: "kind", title: "书籍类型名称"},
                {title: "操作", toolbar: "#rowToolBar"}
            ]],
            size:"lg",
            toolbar:"#tabTop",
        })
        table.on('tool(tableFil)',function (obj) {
            let data = obj.data;
            let event = obj.event;
            switch (event) {
                case "update":
                    layer.open({
                        type: 1,
                        content:
                            "<div class=\"layui-row layui-col-md6 layui-col-md-offset3 \" >"+
                            "<form  action='/KindUpdateByNum'>书籍类型编号： <input type='text' name='kid' readonly value='"+data.kid+"'> " +
                            "<br> 书籍类型名称<input type='text' name='kind' value=' "+data.kind + "'>" +
                            " <br> <button class='layui-btn layui-btn-normal' type='submit'>提交</button> " +
                            "</form></div> ",
                        area:['500px','300px']
                    })
                    break
            }
        })
      table.on('toolbar(tableFil)',function (obj) {
        let event = obj.event;
        switch (event) {
            case 'add':
                layer.open({
                    type:1,
                    content:
                        "<div class=\"layui-row layui-col-md6 layui-col-md-offset3 \" >"+
                        "<form  action='/KindAdd'>请输入新书籍类型名称<input type='text' name='kind' required  value=''>" +
                        " <br> <br><br><button class='layui-btn layui-btn-normal' type='submit'>添加</button> " +
                        " </form></div>",
                    area:['500px','300px']
                })
                break;
        }
    })
        })
</script>
<script type="text/html" id="rowToolBar">
    <button class="layui-btn layui-btn-warm" lay-event="update">
        修改
    </button>
</script>
<script type="text/html" id="tabTop">
    <button class="layui-btn layui-btn-warm "  onclick="window.history.back(-1)">
        返回
    </button>
    <button class="layui-btn layui-btn-normal" lay-event="add">
        添加
    </button>
</script>
</html>
